<template>
  <view class="">
   <view @touchmove.stop.prevent="moveHandle">
     <!-- <uni-popup class="new-pop-style" ref="remark" type="center" :maskClick="false" :show="isFreeStore"> -->
    <view class="new-pop-style" v-if="isFreeStore">
      <view class="new-pop-box">
        <view class="pop-tit">温馨提示</view>
        <view class="pop-conter">
         <view>抱歉，您还未进行商户认证，暂时无法享受此项权益，请点击“去认证”或前往【工作台】-【免费商户认证】进行商户认证。</view>
        </view>
        <view class="pop-foot">
         <view class="btn" @click="closeFreeStorePop">稍后认证</view>
         <view class="btn cur" @click="gotoAuth">去认证</view>
        </view>
      </view>
    </view>
     <!-- </uni-popup> -->
   </view>
   
   <view class="layer" v-if="showApp">
     <view class="appTip" :style="{background: 'url('+imgUrl+'/app/logo-bg.png)', backgroundSize:'100% 100%'}">
       <image :src="imgUrl + '/app/close.png'" class="closeImg" @click="closeShowApp"></image>
       <image class="logo" :src="imgUrl + '/app/logo.png'"></image>
       <view class="txt">六大商城  服务平台  信用资质</view>
       <view class="txt">周边爆品  抵用严选</view>
       <view class="installBtn" @click="installApp">立即安装</view>
     </view>
   </view>
  </view>
  
</template>

<script>
import uniPopup from '@/components/uni-popup/components/uni-popup/uni-popup.vue'
export default {
  components: {uniPopup},
  props: {
    isFreeStore: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      showApp: false,
      imgUrl: 'https://zy-image.oss-cn-hangzhou.aliyuncs.com/image/images'
    }
  },
  computed: {
    userInfo() {
      return this.$store.state.userInfo;
    }
  },
  methods: {
    gotoAuth () {
      // this.isFreeStore = false;
      this.$emit('closeFreeStorePop')
      uni.navigateTo({
        url: '/pages/freeStore/index?inviteId=' + this.userInfo.inviteId
      })
    },
    moveHandle () {
      return
    },
    closeFreeStorePop () {
      this.$emit('closeFreeStorePop')
    },
    buyApp () {
      this.showApp = true;
    },
    installApp () {
      this.isFreeStore = false;
      this.$emit('closeFreeStorePop')
      window.location.href = 'https://ipa.wemallapi.com/luckymall/'
    },
    closeShowApp () {
      this.showApp = false;
    }
  }
}
</script>

<style lang="scss" scoped>
  .layer {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
  }
  .appTip{
    width: 579rpx;
    height: 693rpx;
    position: absolute;
    top:300rpx;
    left:78rpx;
    .logo{
      width: 275rpx;
      height:266rpx;
      margin: 90rpx auto 40rpx auto;
      display:block;
    }
    .closeImg{position: absolute;top:-20rpx;right: 10rpx;width: 46rpx;height: 46rpx;}
    .txt{color: #7D90AB;font-size: 26rpx;margin-bottom: 40rpx;text-align: center;}
    .installBtn{
      width: 474rpx;
      height: 88rpx;
      font-size: 36rpx;
      color: #fff;
      text-align: center;
      background:linear-gradient(0deg,rgba(251,34,43,1) 0%,rgba(249,117,91,1) 100%);
      border-radius:44px;
      line-height: 88rpx;
      margin:10rpx auto
    }
  }
// .good-pop {
//     /deep/  .uni-popup__wrapper-box {
//       padding: 0 !important;
//     }
//    .pop-box {
//      width: 540rpx;
//      height: 420rpx;
//      &-top {
//        font-size: 30rpx;
//        color: #333333;
//        font-weight:500;
//        border-bottom: 1px solid #E1E1E1;
//        text-align: center;
//        padding: 32rpx 0 31rpx;
//        position: relative;
//      }
//      &-cont {
//        padding: 37rpx 41rpx 31rpx;
//        font-size: 28rpx;
//        font-family: PingFang SC;
//        font-weight: 500;
//        color: rgba(0,0,0,1);
//        text-align: center;
//      }
//      .hint-text {
//        margin-bottom: 18rpx;
//        font-size: 22rpx;
//        font-family: PingFang SC;
//        font-weight: 500;
//        color: rgba(153,153,153,1);
//        text-align: center;
//      }
//      &-footer {
//        display: flex;
//        justify-content: space-between;
//        .sub-btn {
//          width: 270rpx;
//          height: 60rpx;
//          line-height: 60rpx;
//          color: #F6DA99;
//          font-size: 24rpx;
//          background-color: #434343;
//          border: none;
//          &.yellow {
//            width: 190rpx;
//            background-color: #F6DA99;
//            color: #434343;
//          }
//          &.sub2 {
//            width: 100%;
//          }
//        }
//      }
//    }
//   }
  /deep/uni-button:after {
    content: '';
    border: none;
  }
</style>
